
import React, { Component } from 'react';
import { Card, Input, Form, Button, message } from 'antd';
import styles from './style.less';


const EditModal = Form.create()(
    // eslint-disable-next-line react/prefer-stateless-function
    class extends React.Component {
        state = {
            loading: false
        }

        render() {
            const { form } = this.props
            const { getFieldDecorator } = form
            return (
                <Form className={styles.loginForm} style={{width: '90%'}}>
                    {getFieldDecorator('content')(<Input.TextArea autoSize={{minRows: 8}} placeholder="如：失、区领导挂点走访情况；具体诉求及处理情况～" />)}
                </Form>
            )
        }
    }
)
// eslint-disable-next-line react/prefer-stateless-function
class CompanyAppeal extends Component {

    componentDidMount = () => {
        const { form } = this.formRef.props
        form.setFieldsValue({
            content: this.props.data
        })
    }

    componentDidUpdate = () => {
        const { form } = this.formRef.props
        form.setFieldsValue({
            content: this.props.data
        })
    }

    saveContent = () => {
        const { form } = this.formRef.props
        const { saveConfirm } = this.props
        form.validateFields((err, values) => {
            if (err) { return; }
            // eslint-disable-next-line eqeqeq
            if (values.content == this.props.data) {
                message.info('诉求情况说明未更改！')
                return;
            }
            saveConfirm(values)
        })
    }

    saveFormRef = formRef => { this.formRef = formRef }

    render () {
        const { type } = this.props
        const EditHead = () => {
            if (type === 'edit') {
                return (
                    <>
                        <Card className={styles.basicHeadLayout} bordered={false}>
                            <div className={styles.headName}>七、企业诉求</div>
                            <Button icon="plus" type="primary" onClick={this.saveContent}>保存</Button>
                        </Card>
                        <Card bordered={false} className={styles.publicContent}>
                            <div style={{ marginBottom: '5px' }}>诉求情况说明</div>
                            <EditModal 
                                wrappedComponentRef={this.saveFormRef}
                            />
                        </Card>
                    </>
                )
            }
            return (
                <>
                    <Card bordered={false} className={styles.publicContent}>
                        <EditModal 
                            wrappedComponentRef={this.saveFormRef}
                        />
                    </Card>
                </>
            )
        }

        return (
            <EditHead />
            
        )
    }
}

// eslint-disable-next-line react/prefer-stateless-function

export default CompanyAppeal